<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>新增教练</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../../layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../../layui/layuiAdmin/css/admin.css" media="all">
</head>
<body>

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">新增教练</div>
                <div class="layui-card-body" pad15>
                    <div class="layui-form-item">
                        <label class="layui-form-label">教练id</label>
                        <div class="layui-input-inline">
                            <input type="text" id="id" lay-verify="required|id" autocomplete="off" placeholder="请输入id" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">教练名称</label>
                        <div class="layui-input-inline">
                            <input type="text"  id="coachName" lay-verify="required|coachName" autocomplete="off"  class="layui-input" placeholder="请输入名称">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">教练身高</label>
                        <div class="layui-input-inline">
                            <input type="text"  id="coachHeight" lay-verify="required|coachHeight" placeholder="请输入身高"  class="layui-input" autocomplete="off">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">教练体重</label>
                        <div class="layui-input-inline">
                            <input type="text"  id="coachWeight" lay-verify="required|coachWeight" placeholder="请输入体重"  class="layui-input" autocomplete="off">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">教练头像</label>
                        <div class="layui-input-inline">
                            <input name="avatar" id="coachHeader" lay-verify="required|coachHeader" autocomplete="off" id="LAY_avatarSrc" placeholder="图片地址" value="http://cdn.layui.com/avatar/168.jpg" class="layui-input">
                        </div>
                        <div class="layui-input-inline layui-btn-container" style="width: auto;">
                            <button type="button" class="layui-btn layui-btn-primary" id="LAY_avatarUpload">
                                <i class="layui-icon">&#xe67c;</i>上传图片
                            </button>
                            <button class="layui-btn layui-btn-primary" layadmin-event="avartatPreview">查看图片</button >
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-submit lay-filter="setmyinfo">确认增加</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重新填写</button>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
</div>

<script src="../../layui/layui.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
    // 点击“确认增加”按钮时，触发表单提交事件
    layui.use('form', function() {
        var form = layui.form;
        form.on('submit(setmyinfo)', function(data) {
            // 获取表单数据
            var coachData = {
                "id": $("#id").val(),
                "coachName": $("#coachName").val(),
                "coachHeight": $("#coachHeight").val(),
                "coachWeight": $("#coachWeight").val(),
                "coachHeader": $("#coachHeader").val()
            };
            // 将JSON对象转换为字符串
            var jsonData = JSON.stringify(coachData);
            // 发送 POST 请求到后端接口
            $.ajax({
                url: '/coach/insertCoach',
                type: 'POST',
                data: jsonData,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(response) {
                    // 请求成功后的处理逻辑
                    alert("添加成功");
                    console.log(response);
                },
                error: function(error) {
                    // 请求失败后的处理逻辑
                    alert("添加失败");
                    console.log(error);
                }
            });
            return false; // 阻止表单跳转提交
        });
    });
</script>


    </body>
</html>